<template>
  <div class="leftDrawer-root">
    <lark-drawer border title="采种田列表" title-height="40px" width="420px">
      <div class="leftDrawer-body">
        <div class="operation-root">
          <div class="input-search">
            <el-input size="mini" placeholder="输入名称进行搜索" @keyup.enter.native="()=>{}">
              <el-button @click="()=>{}" slot="append" size="mini" icon="el-icon-search"></el-button>
            </el-input>
          </div>
          <div class="add-btn">
            <el-button size="mini" @click="()=>{}">新增</el-button>
          </div>
        </div>

      </div>

    </lark-drawer>
  </div>
</template>

<script>
  import { reactive, toRefs, onMounted, ref, watch, computed } from '@vue/composition-api'

  export default {
    name: 'leftDrawer',
    setup(props, content) {
      let data = reactive({})

      return { ...toRefs(data) }
    }
  }
</script>

<style scoped lang="scss">
  .leftDrawer-root {
    .leftDrawer-body {
      padding: 10px;
      height: 48vh;

      .operation-root {
        padding: 0px 10px;
        height: 50px;
        line-height: 50px;
        display: flex;
        flex-direction: row;
        border-bottom: 1px dashed green;

        .add-btn {
          padding: 0 10px;
        }

        .input-search {
          flex: 1 0;
        }
      }
    }

  }
</style>
